Improve AI credit balance meter - #4681
Conversation
| } | ||
|
|
||
| const remaining = ( quota.allowanceRemaining ?? 0 ) + ( quota.purchasedRemaining ?? 0 ); | ||
| const usedFraction = quota.costCap > 0 ? quota.costUsage / quota.costCap : 0; |
There was a problem hiding this comment.
costCap and costUsage - store info only about free allowance. We don't have functionality on the backend yet to return info costCapFOR_PURCHASED_CREDITS and costUsageFOR_PURCHASED_CREDITS.
Also, I remember you wanted to have this p1787155322763389/1787154068.417469-slack-C0BM2EL2Q7Q, which may even require effort from the Shilling team.
That's why I didn't include it in the initial release, since it's not a quick feature, it requires more effort than UI changes.
I propose closing this branch, and I will work on it later.
📊 Performance Test ResultsComparing 5a60c1d vs trunk app-size
site-editor
site-startup
Results are median values from multiple test runs. Legend: 🟢 Improvement (faster) | 🔴 Regression (slower) | ⚪ No change (<50ms diff) |
f7dba99 to
ba8ca13
Compare
|
Whats the latest here? |
|
@shaunandrews It's ready for review. See the |
| } | ||
|
|
||
| .aiCreditsSummary[data-exhausted] strong { | ||
| color: var(--wpds-color-fg-content-error); |
There was a problem hiding this comment.
Trunk has the new updated color token names, we'll need to reconcile these.
The PR’s new CSS still uses old names such as --wpds-color-fg-* and --wpds-color-bg-* in style.module.css (line 502). Current trunk uses --wpds-color-foreground-* and --wpds-color-background-*.
|
This looks great to me; Just the one note about the updated color token names. |
5bfc5c3 to
631e66f
Compare
02e480d to
5a60c1d
Compare
Related issues
Fixes STU-2334
How AI was used in this PR
Assisted
Proposed Changes
With this PR we are adding AI credits balance meter to composer, which reflects the state from Settings -> Usage
Testing Instructions
See testing instruction here - #4758 as that PR adds the same meter to Classic UI. I decided to keep them as separate PRs to simplify review and to easier distinguish the changes added by me from Shaun's changes.